<template>
  <div class="box">
    <header class="header">
      <van-search show-action placeholder="搜索" shape="round">
        <template #left>
          <van-icon name="bar-chart-o" size="22" />
        </template>
        <template #action>
            首页
        </template>
      </van-search>
    </header>
    <div class="content">
      <van-swipe :autoplay="3000" lazy-render>
        <van-swipe-item v-for="image in images" :key="image">
          <img style="width:100%;height:200px" :src="image" />
        </van-swipe-item>
      </van-swipe>
      <van-grid>
        <van-grid-item icon="photo-o" text="文字" />
        <van-grid-item icon="photo-o" text="文字" />
        <van-grid-item icon="photo-o" text="文字" />
        <van-grid-item icon="photo-o" text="文字" />
      </van-grid>
       <ProList></ProList>
    </div>
  </div>
</template>
<script setup>
import ProList from './components/ProList.vue'
const images = [
  "https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg",
  "https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg"
];
</script>